<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
  <link th:replace="layout :: head"/>
</head>

<body>
<div class="layui-col-md12">
  <div class="layui-card">
    <div class="layui-card-header">
      <span>消息数据</span>
    </div>
    <div class="layui-card-body">
      <div class="layui-tab layui-tab-brief" lay-filter="userFilter">
        <ul class="layui-tab-title">
          <li lay-id="P2PMessage" class="layui-this">点对点消息数(条)</li>
          <li lay-id="roomMessage">房间消息数(条)</li>
        </ul>

        <div class="layui-tab-content">
          <div class="layui-tab-item layui-show">
            <form class="layui-form" id="queryFormP2P">
              <div class="layui-card">
                <div class="layui-card-body layui-row layui-col-space10">
                  <div class="layui-col-md4">
                    <div class="form-title">开始时间</div>
                    <div class="form-input">
                      <input type="text" class="layui-input" readonly="readonly" id="P2PCreateDate">
                      <input type="hidden" id="startLeftP2P" name="startLeft" th:value="${start}">
                      <input type="hidden" id="startRightP2P" name="startRight" th:value="${end}">
                    </div>
                  </div>
                  <div class="layui-col-md4"></div>
                </div>
              </div>
            </form>

            <div class="layui-card layui-margin-bottom">
              <div class="layui-card-body">
                <div id="P2PMessage" style="width:1400px;height:500px;"></div>
              </div>
            </div>
          </div>

          <div class="layui-tab-item">
            <form class="layui-form" id="queryFormRoom">
              <div class="layui-card">
                <div class="layui-card-body layui-row layui-col-space10">
                  <div class="layui-col-md4">
                    <div class="form-title">创建时间</div>
                    <div class="form-input">
                      <input type="text" class="layui-input" readonly="readonly" id="roomCreateDate">
                      <input type="hidden" id="startLeftRoom" name="startLeft" th:value="${start}">
                      <input type="hidden" id="startRightRoom" name="startRight" th:value="${end}">
                    </div>
                  </div>
                </div>
              </div>
            </form>

            <div class="layui-card layui-margin-bottom">
              <div class="layui-card-body">
                <div id="roomMessage" style="width:1400px;height:500px;"></div>
              </div>
            </div>
          </div>

        </div>
      </div>
    </div>
  </div>
</div>

<script th:replace="layout :: script"></script>
<script src="https://cdn.staticfile.org/echarts/4.7.0/echarts.min.js"></script>
<script th:src="@{/js/monitor/message.js}"></script>

</body>

</html>
